<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
		<link rel="stylesheet" href="css/header1.css"/>
		<link rel="stylesheet" href="css/leftside.css"/>
		<link rel="stylesheet" href="css/app.css"/>
		<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
	</head>
<body>
		<style type="text/css">
			html,
			body {
				width: 100%;
				height: 100%;
			}

			#myCarousel {
				height: 100px;
			}

		</style>
		

		<div class="main">
		<header>
			<div class="decorate0">
			</div>
			<h1>考试系统</h1>
			<div class="direct3">
				<a href="register">
					<span>注册</span>
				</a>
			</div>
			<div class="direct4">
				<a href="/login">
					<span>登录</span>
				</a>
			</div>
		</header>

			<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="5000">
				<!-- 轮播（Carousel）指标 -->
				<ol class="carousel-indicators">
					<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
					<li data-target="#carousel-example-generic" data-slide-to="1"></li>
					<li data-target="#carousel-example-generic" data-slide-to="2"></li>
					<li data-target="#carousel-example-generic" data-slide-to="3"></li>
				</ol>   
				<!-- 轮播（Carousel）项目 -->
				<div class="carousel-inner">
					<div class="item active">
							<img src="./imagea/bg1.jpg" alt="First slide">
					</div>
					<div class="item">
						<img src="./imagea/bg2.jpg" alt="Second slide">
					</div>
					<div class="item">
						<img src="./imagea/bg3.jpg" alt="Third slide">
					</div>
					<div class="item">
						<img src="./imagea/bg4.jpg" alt="Fourth slide">
					</div>
				</div>
				<!-- 轮播（Carousel）导航 -->
				<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
					<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
					<span class="sr-only">Previous</span>
				</a>
				<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
					<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
					<span class="sr-only">Next</span>
				</a>
			</div> 
			<main class="content">
				<div class="container-fluid p-0">
					<div class="row">
						<div class="col-12 col-md-3">
							<div class="card">
								<div class="card-header">
									<h5 class="card-title" style="font-size:20px;font-family: 宋体;">三种用户模式</h5>
								</div>
								<div class="card-body">
									<p class="card-text" style="font-family: 宋体;">学生加入班级,参与考试,查看可视化成绩反馈；</p>
									<p class="card-text" style="font-family: 宋体;">老师发布班级、考试和试题，流水化批阅试卷，可视化查看成绩；</p>
									<p class="card-text" style="font-family: 宋体;">管理员具有审核权限，模拟老师、学生身份；</p>
									<p class="card-text" style="font-family: 宋体;">三种用户需求完备实现。</p>
								</div>
							</div>
						</div>

						<div class="col-12 col-md-3">
							<div class="card">
								<div class="card-header">
									<h5 class="card-title" style="font-size:20px;font-family: 宋体">考试模式</h5>
								</div>
								<div class="card-body">
									<p class="card-text" style="font-family: 宋体;">一方面，满足同学参与，老师发布、批改、分析，管理员审核考试。</p>
									<p class="card-text" style="font-family: 宋体;">另一方面，增加创意点，同学在签到时可以抽卡增加趣味、缓解考试焦虑；还有防作弊模式：防止复制和到点自动交卷；试卷批改方面包括客观题自动批改，以及老师对主观题进行流水线批改。</p>
								</div>
							</div>
						</div>
						
					
						<div class="col-12 col-md-3">
							<div class="card">
								<div class="card-header">
									<h5 class="card-title" style="font-size:20px;font-family: 宋体">题库模式</h5>
								</div>
								<div class="card-body">
									<p class="card-text" style="font-family: 宋体;">题库基本需求满足由老师选择是否将考试题目加入题库，并且由管理员审核该题是否可发布，最后学生可自行选择题目进行练习。</p>
									<p class="card-text" style="font-family: 宋体;">创新点包括学生个性化答题体验，在完成题目时有记录功能，一方面可以帮助同学理清思路，另一方面可以利用该机制进行考后复习总结。</p>
								</div>
							</div>
						</div>
					
						<div class="col-12 col-md-3">
							<div class="card">
								<div class="card-header">
									<h5 class="card-title" style="font-size:20px;font-family: 宋体">班级模式</h5>
								</div>
								<div class="card-body">
									<p class="card-text" style="font-family: 宋体;">学生和老师通过对应班级能更有条理地联系。</p>
									<p class="card-text" style="font-family: 宋体;">老师可以根据班级上传考试、批改试卷、并且可视化地查看班级成绩，分析学生学习情况；</p>
									<p class="card-text" style="font-family: 宋体;">学生在班级可以参与考试、查看考试信息；</p>
									<p class="card-text" style="font-family: 宋体;">而管理员对班级起到审核、监督作用。</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</main>


		<script src="js/app.js"></script>
		<script src="js/echarts.min.js"></script>
	</body>
</html>

